<template>
  <div class="app-container flex flex-col history-container bg-dark">
    <div class="tool-bar flex flex-center flex-end">
      <div class="tool-item">
        <span class="title">Job ID:</span>
        <el-input
          v-model="condition.job_id"
          :size="'mini'"
          clearable
        />
      </div>
      <div class="tool-item">
        <span class="title">Role:</span>
        <el-select v-model="condition.role" :size="'mini'" collapse-tags multiple placeholder>
          <el-option
            v-for="item in roleOptions"
            :key="item.value"
            :value="item.value"
            :label="item.label"
          />
        </el-select>
      </div>
      <div class="tool-item">
        <span class="title">Party ID:</span>
        <el-input
          v-model="condition.party_id"
          :size="'mini'"
          clearable
        />
      </div>
      <div class="tool-item">
        <span class="title">Partner:</span>
        <el-input
          v-model="condition.partner"
          :size="'mini'"
          clearable

        />
      </div>

      <div class="tool-item">
        <span class="title">Note:</span>
        <el-input
          v-model="condition.note"
          :size="'mini'"
          clearable

        />
      </div>
      <el-button :size="'mini'" type="primary" round >Search</el-button>
    </div>
  </div>
</template>

<script>
/**
 *
 *  Copyright 2019 The FATE Authors. All Rights Reserved.
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 *
 */
import { mapActions } from 'vuex'
import { queryJobs, addNotes, killJob, retryJob, queryFileds } from '@/api/job'
export default {
  name: 'TRAINING',

  components: {

  },
  props: {},

  data() {
    return {
      condition: {
        role: '',
        status: '',
        job_id: '',
        party_id: '',
        note: '',
        orderRule: 'desc',
        // orderField: 'f_start_time'
        orderField: 'f_job_id',
        partner: ''
      },
      roleOptions: [],
    }
  },

  beforeMount() {

  },
  beforeDestroy() {

  },

  methods: {

  }
}
</script>

<style scoped lang="scss">

</style>
